<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta name="viewport"
			content="width=device-width,height=device-height,inital-scale=1.0,maximum-scale=1.0,user-scalable=no;" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<meta name="format-detection" content="telephone=no" />
		<base target="_blank"/>
		<title>酒店详情</title>
		
 		<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
		<script type="text/javascript" src="{cms>:$jsPath}/jquery.slides.min.js"></script>
		

		<link rel="stylesheet" href="{cms>:$cssPath}/spg.css">
		<link rel="stylesheet" href="{cms>:$cssPath}/example.css">
		<link rel="stylesheet" href="{cms>:$cssPath}/font-awesome.min.css">
		  
		<style type="text/css">
			body{
				background-color: #271a40;
				margin: 0;
			}
			#content{
				text-align: left;
				font: normal 16px arial;
				background-color: white;
				margin-left: 5px;
				margin-right:5px;
				padding-bottom: 1px;
				position: relative;
				top: -20px;
			}
			a{		
				text-decoration: none;
				font: normal 16px arial;
				color: #664f8c;
			}
			div.left{
				float:left;
			}
			.row{
				margin: 10px 5px 10px 5px; 
				background-color: #e6e1ce;
				background-size: 15px 15px;
				background-position-x: 96%;
				color:black; 
				text-decoration:none; 
				font:normal 16px arial; 
				padding:10px;
			}
			table {
				width: 100%;
			}
			table td{
				background-color:#271a40;
				width:47%;
				float:left;
				margin:1%;
				height: 40px;
				border-radius: 3px;
			}
			div.searchButton a{
				color: white;
				font: normal 16px arial;
				position: relative;
				top: 9px;
				text-align:right;
			}	
			#footer_span{
				bottom: 35px;
			}
		
		    body {
		      -webkit-font-smoothing: antialiased;
		    }
		    
		    #slides {
		      display: none
		    }
		
		    #slides .slidesjs-navigation {
		      margin-top:5px;
		    }
		
		    a.slidesjs-next,
		    a.slidesjs-previous,
		    a.slidesjs-play,
		    a.slidesjs-stop,
		    slidesjs-navigation {
		      display:none;
		    }
		
		    a.slidesjs-next {
		      margin-right:10px;
		      background-position: -12px 0;
		    }
		
		    a:hover.slidesjs-next {
		      background-position: -12px -18px;
		    }
		
		    a.slidesjs-previous {
		      background-position: 0 0;
		    }
		
		    a:hover.slidesjs-previous {
		      background-position: 0 -18px;
		    }
		
		    a.slidesjs-play {
		      width:15px;
		      background-position: -25px 0;
		    }
		
		    a:hover.slidesjs-play {
		      background-position: -25px -18px;
		    }
		
		    a.slidesjs-stop {
		      width:18px;
		      background-position: -41px 0;
		    }
		
		    a:hover.slidesjs-stop {
		      background-position: -41px -18px;
		    }
		
		    .slidesjs-pagination {
		      margin: 7px 0 0;
		      list-style: none;
		      position: relative;
			top: -25px;
			z-index: 1000;
			text-align: center;
			width: 100%;
			padding: 0;
		    }
		
		    .slidesjs-pagination li {
		      display: inline-block;
		    }
		
		    .slidesjs-pagination li a {
		      display: block;
		      width: 13px;
		      height: 0;
		      padding-top: 13px;
		      background-image: url({cms>:$imagePath}/pagination.png);
		      background-position: 0 0;
		      float: left;
		      overflow: hidden;
		    }
		
		    .slidesjs-pagination li a.active,
		    .slidesjs-pagination li a:hover.active {
		      background-position: 0 -13px
		    }
		
		    .slidesjs-pagination li a:hover {
		      background-position: 0 -26px
		    }
		
		    #slides a:link,
		    #slides a:visited {
		      color: #333
		    }
		
		    #slides a:hover,
		    #slides a:active {
		      color: #9e2020
		    }
		
		    .navbar {
		      overflow: hidden
		    }
			</style>
			 <style>
		    #slides {
		      display: none
		    }
		
		    .container {
		      margin: 0;
		    }
		
		    /* For tablets & smart phones */
		    @media (max-width: 767px) {
		      .container {
		        width: 100%
		      }
		    }
		
		    /* For smartphones */
		    @media (max-width: 480px) {
		      .container {
		        width: auto
		      }
		    }
		
		    /* For smaller displays like laptops */
		    @media (min-width: 768px) and (max-width: 979px) {
		      .container {
		        width: 724px
		      }
		    }
		
		    /* For larger displays */
		    @media (min-width: 1200px) {
		      .container {
		        width: 100%
		      }
		    }
		  </style>
		  
	</head>
	
	<body>
  <div class="container">
    <div id="slides">
		<volist name="imgs" id="img">
			<img src="{cms>:$img}">
		</volist>
    </div>
  </div>
  
	<div id="content" num="0">	
			<div style="font: bold 18px arial; text-align: center;padding: 12px;">
				<span>{cms>:$name}<br/></span>
			</div>
			<div style="padding-left: 30px;color: #664f8d;font: bold 15px arial;">
				<span style="line-height: 20px;">
					{cms>:$country}<br/>
					{cms>:$city}，{cms>:$state}<br/>
					{cms>:$address}<br/>
					邮政编码 {cms>:$postCode}<br/>
				</span>
				<span>
					SPG 俱乐部类别 {cms>:$category}
				</span>
				<span style="padding-left: 52px;">
					{cms>:$phone}
				</span>
			</div>
			<div style="margin: 20px;background-color: #271a40;padding: 10px; text-align:center;display:none">
				<div class="dateInfo checkinInfo" style="color:white; ">
					<span id="arrivalDateDisplay" class="checkInInstructionsDate">查找可用日期</span>
							<div class="calendarIconContainer" style="display:none;">
								<a href="#" id="advSearchCal" class="iconSquare calendarIcon brandColorWhite calendarBKGD" data-today="{cms>:$today}" aria-hidden="true">选择日期</a>
							</div>
				</div>
			</div>
			<div class="row" style="margin: 30px 15px 1px 15px;">
				<a id="" href="{cms>:U('Booking/pictures',array('hotelCode'=>$hotelCode))}">图片及视频</a>
			</div>
			<div class="row" style="margin: 0 15px 1px 15px;">
				<a id="" href="{cms>:U('Booking/room',array('hotelCode'=>$hotelCode))}">客房</a>
			</div>
			<!--div class="row" style="margin: 0 15px 1px 15px;">
				<a id="" href="{cms>:U('Booking/hotelfeature',array('hotelCode'=>$hotelCode))}">特色</a>
			</div-->
			<div class="row" style="margin: 0 15px 1px 15px;">
				<a id="" href="{cms>:U('Booking/dish',array('hotelCode'=>$hotelCode))}">餐饮</a>
			</div>
			<div class="row" style="margin: 0 15px 1px 15px;">
				<a id="" href="{cms>:U('Booking/transportation',array('hotelCode'=>$hotelCode))}">交通选择</a>
			</div>
			<div class="row" style="margin: 0 15px 10px 15px;">
				<a id="" href="{cms>:U('Booking/route',array('hotelCode'=>$hotelCode))}">路线指引及联系方式</a>
			</div>
			
			<div class="row" style="margin: 5px 15px 10px 15px; text-align: center;">
				<a id="" href="{cms>:U('Booking/abouthotel',array('hotelCode'=>$hotelCode))}">关于酒店及度假村</a>
			</div>
			
		</div>
		
		<script>
		    $(function() {
				var w=$(window).width();
				var bs=w/568;
				var h=230*bs;
				//alert(w+','+h);
		        $('#slides').slidesjs({
		          width: w,
		          height: h,
		          play: {
		            active: true,
		            auto: true,
		            interval: 4000,
		            swap: true
		          }
		        });
		        $(".slidesjs-stop").css("display", "none");
		      });
		</script>

<include file="footer" />